<template>
  <span> {{text}}:</span>
  <q-input
    dense
    outlined
    label="美食"
  />
</template>

<script lang="ts">
import { defineComponent, toRefs } from  'vue';


export default defineComponent({
  name: 'TextInput',
  props: {
    text: {
      type: String,
      required: true
    }
  },

  setup (props, context) {
    // 解构props，简单类型，只读类型
    let {
      text
    } = toRefs(props);

    return {
      text
    };
  }
});

</script>

<style lang="scss" scoped>

</style>
